<template>
    <div class="view">
        <img src="../../../assets/logo.png" alt="" class="logo">
        <div class="big-btn" @click="scan">
            <div>
                <p><i class="iconfont icon-saoma"></i></p>
                <span>扫药品</span>
            </div>
        </div>
        <div class="tips">
            <h4>扫码用药</h4>
            <p>用药安全专家，为健康保驾护航</p>
        </div>
        <bottom-dowload></bottom-dowload>
    </div>
</template>

<script>
import bottomDowload from "@/components/bottomDowload.vue";
import { wxShare } from "@/utils";

export default {
  components: { bottomDowload },
  data() {
    return {};
  },
  methods: {
    scan() {
      // console.log(111);
      // this.$router.push("/drugs?id=" + 111);
      wx.scanQRCode({
        needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
        scanType: ["qrCode", "barCode"], // 可以指定扫二维码还是一维码，默认二者都有
        success: res => {
          let codeType = res.resultStr.split(",")[0];
          let result = res.resultStr.split(",")[1]; // 当needResult 为 1 时，扫码返回的结果
          if (codeType == "EAN_13") {
            this.$router.push("/drugs?id=" + result);
          } else {
            this.$vux.toast.text("你扫描的不是药品条形码！", "top");
          }
        },
        error: function(err) {
          console.log(err);
        }
      });
    }
  },
  mounted() {
    wxShare({
      title: "买药扫一扫  用药更安心",
      text: " 星诊所，用药安全专家",
      href: location.href,
      imgUrl: "https://app.allclinic.cn/h5/wx/scan_drug/static/img/logo.jpg"
    });
  }
};
</script>

<style lang="less" scoped>
.view {
  text-align: center;
  background: white;
  height: 100vh;
}
.tips {
  width: 2.66rem;
  height: 0.78rem;
  margin: 0.45rem auto 0 auto;
  background: rgba(244, 250, 254, 1);
  border-radius: 8px;
  color: #959595;
  h4 {
    font-size: 0.17rem;
    padding-top: 0.18rem;
    font-weight: 500;
  }
  p {
    margin-top: 0.1rem;
  }
}
.logo {
  width: 1.6rem;
  display: block;
  padding-top: 0.75rem;
  margin: 0 auto 0.3rem auto;
}
.big-btn {
  text-align: center;
  border: 20px solid rgba(13, 213, 217, 0.1);
  border-radius: 100%;
  display: inline-block;
  div {
    font-size: 0.14rem;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 100%;
    color: white;
    span {
      display: inline-block;
      margin-top: 10px;
    }
    p {
      padding-top: 30px;
    }
    i {
      font-size: 0.78rem;
    }
    background: linear-gradient(
      180deg,
      rgba(22, 243, 231, 1) 0%,
      rgba(2, 178, 251, 1) 100%
    );
  }
}
</style>

